/**
* @Description: WoShop商城
* @Author: 梧桐
* @Copyright: 武汉一一零七科技有限公司©版权所有
* @Link: www.wo-shop.net
* @Contact: QQ:2487937004
*/
<template>
	<view class="index_class">
		<view class="setup">
			<view class="per-lists" style="margin-top: 0;">
				<view class="form-item">
					<text class="">{{$t('手机号')}}</text>
					<input type="number" class="input" v-model="phone" :placeholder="$t('请输入手机号')" maxlength="11" />
				</view>
				<div class="form-item code">
					<text>{{$t('验证码')}}</text>
					<input type="number" maxlength="6" v-model="code" :placeholder="$t('请输入验证码')" />
					<span class="getcode" @click="getCode">{{ isStart ? time + 's'+$t('后重新获取') : $t('获取验证码') }}</span>
				</div>
			</view>

			<view class="person-button">
				<button type="warn" @click="confirmClick" class="btn">{{$t('确认')}}</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name: "",
				nickname: "",
				phone: "",
				pwd: "",
				code: '',
				clickText: this.$t('获取验证码'),
				isOpen: true,
				timer: null,
				time: 60,
				isSend: false,
				isStart: false
			};
		},
		methods: {
			change() {
				this.isOpen != this.isOpen;
			},
			confirmClick() {
				if (this.phone == "") {
					this.$toast(this.$t('请输入手机号'));
					return false;
				}
				if (this.phone.length != 11) {
					this.$toast(this.$t('手机号码不正确'));
					return false;
				}

				if (!this.code) {
					return this.$toast(this.$t('请输入手机验证码'))
				}
				this.$http.getaddSubaccount({
						phone: this.phone,
						sms_code: this.code
					})
					.then(res => {
						if (res.status == 200) {
							this.$toast(res.mess);
							setTimeout(() => {
								this.getback();
							}, 1500);
						}
						console.log(this.code);
					});
			},
			getCode() {
				if (this.isSend) {
					this.$toast(this.$t('验证码已发送'))

					return false
				}

				if (!/^1[0-9]{10,10}$/.test(this.phone)) {
					this.$toast(this.$t('请输入正确到手机号'))

					return false
				}

				this.$loading()
				this.isSend = true
				this.$http.getSmsCode({
					phone: this.phone,
					type: 4
				}).then(res => {
					if (res.status === 200) {
						this.$toast(this.$t('验证码发送成功'))
						this.isStart = true
						this.timer = setInterval(() => {
							if (this.time === 0) {
								this.isSend = false
								this.isStart = false
								clearInterval(this.timer)

								return false
							}

							this.time = this.time - 1
						}, 1000)
					} else {
						this.isSend = false
						this.$toast(res.mess)
					}
				}).catch(err => {
					this.isSend = false
				})
			}
		}
	};
</script>

<style lang="less" scoped>
	.code-right {
		display: flex;
		justify-content: space-between;
	}

	.items {
		display: flex;

		.eyes {
			width: 40upx;
			height: 40upx;
			background-color: red;
		}
	}

	.form-item {
		display: flex;
		align-items: center;
		height: 88upx;
		padding: 0 30upx;
		border-bottom: 1upx solid #eee;

		text {
			width: 180upx;
		}

		input {
			flex: 1;
			height: 100%;
		}
	}

	.items {}
</style>
